import React, { useEffect } from 'react'
import { Form, Input, Button, TextArea, Toast } from 'antd-mobile'
import axios from 'axios'
import { useNavigate } from 'react-router-dom'
export default function SetMy() {
  const navigate = useNavigate()
  // console.log(JSON.parse(localStorage.getItem("token")), "name");
  const obj = JSON.parse(localStorage.getItem('token')) || ''
  const onFinish = values => {
    console.log(obj)
    axios.patch(`http://localhost:3004/users/${obj.id}`, {
      username: values.username,
      password: values.password,
      name: values.name,
      phone: values.phone,
      city: values.city,
      job_unit: values.job_unit,
      industry: values.industry,
    })
    Toast.show({
      icon: 'success',
      content: '修改成功',
    })
    localStorage.clear()
    setTimeout(() => {
      navigate('/login')
    }, 2000)
  }
  return (
    <div>
      <Form
        layout="horizontal"
        onFinish={onFinish}
        footer={
          <Button
            block
            type="submit"
            color="primary"
            size="small"
            style={{
              width: '50%',
              margin: '20px auto',
              borderRadius: '15px',
            }}
          >
            提交
          </Button>
        }
      >
        <Form.Item
          name="name"
          label="姓名"
          rules={[{ required: true, message: '姓名不能为空' }]}
        >
          <Input placeholder={obj.name} />
        </Form.Item>
        <Form.Item name="phone" label="手机">
          <Input placeholder={obj.phone} />
        </Form.Item>
        <Form.Item name="city" label="所在城市">
          <Input placeholder={obj.city} />
        </Form.Item>
        <Form.Item name="job_unit" label="所在单位">
          <Input placeholder={obj.job_unit} />
        </Form.Item>
        <Form.Item name="industry" label="行业领域">
          <Input placeholder={obj.industry} />
        </Form.Item>
      </Form>
    </div>
  )
}
